<script setup lang="ts">
import { PropType, reactive, ref } from 'vue'
import type { TableData } from '@/api/uc/org/types'
import { Descriptions } from '@/components/Descriptions'
import { useI18n } from '@/hooks/web/useI18n'
import { ElTag, ElImage } from 'element-plus'
import { zcInventoryRuleGetAssetListApi } from '@/api/cy/xPanrule'
// 获取字典
import { useCache } from '@/hooks/web/useCache'
import { useTable } from '@/hooks/web/useTableTest'
import { useCrudSchemas } from '@/hooks/web/useCrudSchemas'
const { wsCache } = useCache()
const dict: any = wsCache.get('dict')
// 字典通过value获取label
const getDictLabel = (type, value) => {
  let data = dict[type].find((item) => {
    return item.value == value
  })
  return data ? data.label : ''
}
const { t } = useI18n()

const props = defineProps({
  currentRow: {
    type: Object as PropType<Nullable<TableData>>,
    default: () => null
  },
  detailSchema: {
    type: Array as PropType<DescriptionsSchema[]>,
    default: () => []
  },
  id: {
    type: String,
    default: null
  }
})

const d_columns = reactive<TableColumn[]>([
  {
    field: 'index',
    label: '主键',
    type: 'index',
    width: 30
  },
  {
    field: 'asset_code',
    label: '资产编码',
    width: 150
  },
  {
    field: 'earcon_code',
    label: '耳标号',
    width: 150
  },
  {
    field: 'breed',
    label: '畜别',
    formatter: (_: Recordable, __: TableColumn, cellValue: number | string) => {
      return getDictLabel('breed', cellValue)
    },
    width: 100,
    search: {
      show: true
    }
  },
  {
    field: 'breed_sub',
    label: '品种',
    formatter: (_: Recordable, __: TableColumn, cellValue: number | string) => {
      return getDictLabel('breed_sub', cellValue)
    }
  },
  {
    field: 'sex',
    label: '性别',
    width: 150,
    formatter: (_: Recordable, __: TableColumn, cellValue: number | string) => {
      return getDictLabel('animal_sex', cellValue)
    }
  }
])
const { allSchemas } = useCrudSchemas(d_columns)
const newFixedSearch = ref({})
const { tableObject, methods } = useTable<
  {
    total: number
    list: any[]
  },
  any
>({
  getListApi: zcInventoryRuleGetAssetListApi,
  response: {
    data: 'data',
    count: 'count'
  }
})
const { getList } = methods

const init = async () => {
  // const res = await zcInventoryRuleGetAssetListApi({ id: props.id, pageNo: 1, pageSize: 10 })
  // // console.log(res.data, 'res.data')
  // detailedData.value = await res.data
  // const { getList, setSearchParams } = methods
}
init()

newFixedSearch.value = {
  id: props.id
}
tableObject.fixedSearch = newFixedSearch.value

getList()
console.log(tableObject, 'eee')
</script>

<template>
  <ContentWrap title="主数据">
    <div>
      <Descriptions :schema="props.detailSchema" :data="props.currentRow || {}">
        <template #is_stop="{ row }: { row: TableData }">
          <ElTag
            :type="row.is_stop === '0' ? 'success' : row.is_stop === '1' ? 'warning' : 'danger'"
          >
            {{
              row.is_stop === '0' ? '启用' : row.is_stop === '1' ? '停用' : t('tableDemo.commonly')
            }}
          </ElTag>
        </template>

        <template #type="{ row }">
          <div>{{ getDictLabel('inventory_type', row.type) }}</div>
        </template>
        <template #state="{ row }">
          <div>{{ getDictLabel('inventory_type', row.state) }}</div>
        </template>

        <template #business_license="{ row }: { row: TableData }">
          <ElImage v-if="row.business_license" :src="row.business_license" />
        </template>

        <template #identity_card_front="{ row }: { row: TableData }">
          <ElImage v-if="row.identity_card_front" :src="row.identity_card_front" />
        </template>

        <template #identity_card_back="{ row }: { row: TableData }">
          <ElImage v-if="row.identity_card_back" :src="row.identity_card_back" />
        </template>
      </Descriptions>
    </div>
  </ContentWrap>
  <ContentWrap title="明细数据">
    <Table
      v-model:pageSize="tableObject.pageSize"
      v-model:currentPage="tableObject.currentPage"
      :columns="allSchemas.tableColumns"
      :loading="tableObject.loading"
      :data="tableObject.tableList"
      :border="true"
      :pagination="{
        total: tableObject.count
      }"
      :selection="false"
  /></ContentWrap>
</template>
